<template>
	<view class="container">
		
		<view class="title" v-for="(item, index) in catalogList" :key="item.id" @click="handleOpenPage(item.id)">
			<view class="catalog">{{ item.articleTitle }}</view>
		</view>
		
		<!-- 加载 -->
		<uni-load-more :status="hasFlag ? 'loading' : isNoMore ? 'noMore' : ''"></uni-load-more>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue'
	export default {
		components:{
			uniLoadMore,
		},
		data() {
			return {
				hasFlag: true, // 是否还有更多数据要加载
				catalogList: [],//目录列表
				requestObj: {
					typeId: 2, //2帮助中心
					pageSize: 10,
					pageNum: 0,
				},
				isNoMore:false,
			}
		},
		methods: {
			handleOpenPage(id) {
				uni.navigateTo({ url: '/pages/help-detail/help-detail?id=' + id})
			},
			//获取帮助中心目录列表
			async get_article_by_type () {
				if (!this.hasFlag) return // 说明已经没有更多啦
				++this.requestObj.pageNum
				
				console.log(uni.getStorageSync('userType'))
				
				if(uni.getStorageSync('userType')==0){//雇员
					this.requestObj.typeId=4
				}else{//雇主
					this.requestObj.typeId=3
				}

				let res = await this.$fetch(this.$api.get_article_by_type, this.requestObj, 'POST')
				
				
				
				if (res.code) return uni.showToast({ title: res.msg, icon: 'none' })

				// 拼接
				this.catalogList = [...this.catalogList, ...res.rows]
				this.hasFlag = this.catalogList.length < res.total
			},
		},
		onLoad() {
			this.get_article_by_type()
		}
	}
</script>

<style lang="less">
	page {
		background-color: #FFFFFF;
	}
	.container {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		& > .title {
			width: 690rpx;
			height: 100rpx;
			margin-top: 30rpx;
			border-radius: 20rpx;
			background: rgba(252,201,40,0.8);//#FCC928;
			// color: #fffff;
			font-size: 16px;
			display: flex;
			justify-content: center;
			align-items: center;
			
			&:active {
				opacity: 0.7;
			}
		}
	}
</style>
